<!DOCTYPE html>
<html xmlns:h="http://xmlns.jcp.org/jsf/html" 
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <f:view>
        <f:metadata>
            <f:viewParam name="id" value="#{viewPostBean.id}"/>
            <f:viewAction action="#{viewPostBean.init()}"/>
        </f:metadata>
        <h:head>
            <title>Post Details</title>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        </h:head>
        <h:body>
            <h1>Post Details</h1>
            <table>
                <tr><td>Title</td><td>#{viewPostBean.post.title}</td></tr>
                <tr><td>Content</td><td>#{viewPostBean.post.body}</td></tr>
                <tr><td>Tags</td><td>#{viewPostBean.post.tags}</td></tr>
                <tr><td>Created</td><td>#{viewPostBean.post.created}</td></tr>
            </table>

            <h2>Comments</h2>
            <ui:repeat value="#{viewPostBean.post.comments}" var="c">
                <p>#{c.content}</p>
            </ui:repeat>

            <h2> Add Comment</h2>
            <h:form prependId="false">
                <h:panelGrid columns="2">
                    <h:outputLabel for="body">Content</h:outputLabel>
                    <h:inputTextarea id="body" value="#{viewPostBean.commentBody}" rows="5"/>
                    <h:commandButton action="#{viewPostBean.save}" value="Save"></h:commandButton>
                    <h:panelGroup/>
                    <h:commandButton action="#{viewPostBean.voteUp()}" value="#{viewPostBean.voteUp} UP"></h:commandButton>
                     <h:commandButton action="#{viewPostBean.voteDown()}" value="#{viewPostBean.voteDown} Down"></h:commandButton>
                </h:panelGrid>
            </h:form>
            <h:button outcome="posts.xhtml" value="Back to Post List"></h:button>
        </h:body>
    </f:view>
</html>
